<template>
	<view>
		<view class="content">
			<p style="background-color: #FFF;margin: 20rpx;border-radius: 10rpx;padding: 20rpx;">商品详情：
				<view class="cart_item" v-for="(item,index) in dada" :key='item.id'>
					<u--image :src="item.image" width="80px" height="80px" style="margin-top: 20rpx;"
						radius="20rpx"></u--image>
					<view style="margin-left: 200rpx;margin-top: -150rpx;">
						<p>商品：{{item.medicine.name}}</p>
						<p style="margin: 10rpx 0;">单价：{{item.medicine.price}}</p>
						<p style="margin: 10rpx 0;">数量：{{item.amount}}</p>
						<p>价格：{{item.amount * item.medicine.price}}</p>
					</view>
				</view>
			</p>
		</view>
		<view class="content">
			<p style="background-color: #FFF;margin: 20rpx;border-radius: 10rpx;padding: 20rpx;">我的收货地址：
				<view class="cart_item" v-for="(item,index) in addressArr" :key="item.id" style="margin-top: 20rpx;">
					<p>收货人：{{item.userName}}</p>
					<p style="margin: 10rpx 0;">电话：{{item.phone}}</p>
					<p style="margin: 10rpx 0;">详细地址：{{item.region + item.address}}</p>
				</view>
				<u-action-sheet :actions="data" title="选择地址" :show="show" @select="selectClick" @close="show=false"
					:closeOnClickOverlay="true" :closeOnClickAction="true"></u-action-sheet>
				<u-button @click="show = true">选择地址</u-button>
			</p>
		</view>
		<view style="position: fixed;bottom: 0;left: 0;width: 100%;">
			<u-button type="primary" text="确定支付" @click="gozf"></u-button>
		</view>
	</view>

</template>

<script>
	import {
		huoqudingdanAPI,
		tijiaodingdanAPI,
		getShopCartAPI,
		GetUserAddressAPI,
		deleteShopCartAPI
	} from "../../services/api.js"

	import {
		dalImg,
		getSimpleDate
	} from "../../utils/tools.js"
	export default {
		data() {
			return {
				ev:{},
				show: false,
				dada: [],
				addressArr: [],
				dat: {
					region: "",
					regionCode: "",
					address: "",
					orderDetails: [{
						price: 0,
						medicine: "",
						amount: 0
					}]
				},
				data: [],
				arr: [],
				id: ""
			}
		},
		methods: {
			selectClick(index) {
				console.log(index)
				this.addressArr = [index]
				this.dat.region = index.region
				this.dat.regionCode = index.regionCode
				this.dat.address = index.address
			},

			gozf() {
				const that = this
				this.dat.orderDetails.medicine = String(this.dat.orderDetails.medicine)
				console.log(this.dada)
				for (let i in that.dada) {
						// that.dat.orderDetails=[]
						that.dat.orderDetails.push({
							price: that.dada[i ].price,
							medicine: that.dada[i ].medicineId,
							amount: that.dada[i ].amount
						})
					
				}
				that.dat.orderDetails.splice(0,1)
				console.log(that.dat)
				tijiaodingdanAPI(this.dat).then(res => {
					console.log(res);
					if (res.success == true) {
						uni.showToast({
							title: '支付成功',
							icon: "success",
							duration: 1000
						})
						setTimeout(()=>{
						uni.switchTab({
							url:"/pages/cart/cart"
						})
							
						},500)

					}
					
					deleteShopCartAPI(this.ev.id).then(res=>{
						console.log(res);
						this.liss()
						console.log(this.dada);
						if(this.dada.length==0){
							console.log(this.allChecked);
							// this.allChecked =!this.allChecked;
						}
					})
				})
			},
			getUserAddress() {
				GetUserAddressAPI().then((res) => {
					console.log(res);

					this.data = res.data.map(item => {
						return {
							...item,
							userName: item.name,
							name: item.name + item.phone,
							subname: item.region + item.address
						}
					})
					console.log(this.data);
					this.addressArr = res.data.filter(function(item, index, array) {
						return item.isDefault == true; // true || false
					}).map(item => {
						return {
							...item,
							userName: item.name,
							name: item.name + item.phone,
							subname: item.region + item.address
						}
					})
					console.log(this.addressArr);
					this.dat.region = this.addressArr[0].region;
					this.dat.regionCode = this.addressArr[0].regionCode;
					this.dat.address = this.addressArr[0].address;
				})
			},
			liss() {
				const that = this
				getShopCartAPI().then(res => {
					console.log(res)
					this.dada = res.data.list.filter(function(item, index, array) {
							return that.arr.includes(item.id); // true || false
						})
						.map(item => {
							return {
								...item,
								image: dalImg(item.medicine.image),
								createdAt: getSimpleDate(new Date(item.createdAt))
							}
						})
					console.log(this.dada);
				})
			},
		},
		onLoad(ev) {
			this.liss()
			this.ev=ev
			this.arr = ev.id.split(",")
			this.dat.orderDetails[0].medicine = ev.id
			this.dat.orderDetails[0].price = ev.price * 1
			this.dat.orderDetails[0].amount = ev.amount * 1
			console.log(this.dat)
			//this.list()
			this.getUserAddress()
		},
		onShow() {
			this.dada = []
		}
	}
</script>

<style>
	.content {
		background-color: #f2f2f2;
		display: flex;
		flex-direction: column;
	}

	.cart_item {
		background-color: #fff;
		height: 180rpx;
		margin: 0rpx 20rpx;
		padding-left: 20rpx;
		border-radius: 20rpx;
		font-size: 26rpx;

	}
</style>